<template>
    <div>
        <a-modal
         v-model:visible="visible" 
         :title="formState.id?formState.view?'查看附件':'编辑附件':'新增附件'" 
         @ok="handleOk" 
         @cancel="visible = false"
         class="enterprise-add-edit-modal"
         :width="700"
         :footer="null"
        >
            <div v-if="visible">
                <a-form :form="form" layout="horizontal" class="add-edit-form">
                    <a-form-item label="附件名称">
                        <a-input
                        v-model:value="formState.fwjxsmc"
                        placeholder="请输入附件名称"
                        v-decorator="[
                            'fwjxsmc', { initialValue:formState.fwjxsmc, rules: rules.fwjxsmc}
                        ]"/>
                    </a-form-item>
                    <a-form-item label="附件说明">
                        <a-input
                        v-model:value="formState.fwjlx5"
                        placeholder="请输入附件说明"
                        v-decorator="[
                            'fwjlx5', { initialValue:formState.fwjlx5, rules: rules.fwjlx5}
                        ]"/>
                    </a-form-item>
                    <a-form-item label="附件备注" class="flex-1-box">
                        <a-textarea 
                            placeholder="请输入附件备注"
                            v-model:value="formState.fwjlx6"
                            :autosize="{ minRows: 1, maxRows: 10000 }"
                        ></a-textarea>
                    </a-form-item>
                    <a-form-item label="附件" class="flex-1-box">
                        <div>
                            {{ formState.fwjxsmc+formState.fwjlx }}
                            <a-icon style="font-size: 16px;margin: 0 10px;color: #1ab394;" type="download" @click="downloadClick"/>
                            <a-button v-if="!formState.fwjxsmc && !formState.fwjlx5" class="blue-btn" @click="uploadIzClick" icon="import">上传</a-button>
                            <a-upload v-else :showUploadList="false" :beforeUpload="$event=>{return false}" action="" @change="uploadChange">
                                <a-button class="blue-btn" icon="import">{{formState.id?'替换文件':'上传'}}</a-button>
                            </a-upload>
                        </div>
                    </a-form-item>
                </a-form>
            </div>
            <div style="
                display: flex; justify-content: flex-end;
                margin-top: 20px; width: 100%;
                background-color: #fff;">
                <a-button @click="visible = false">取消</a-button>
                <a-button v-if="!formState.view" style="margin: 0 20px;" class="blue-btn" type="primary" @click="handleOk(true)">保存</a-button>
                <a-button v-if="!formState.view" class="blue-btn" type="primary" @click="handleOk(false)">保存并关闭</a-button>
            </div>
        </a-modal>
    </div>
</template>
<script>
import compSelector from '@/components/compSelector/compSelector.vue'
import { queryYwzdByCode, spcyQyInfouploadScgyFile,spcyQyInfouploadThgyFile, spcyQyInfoupdateFj, } from '../service/index'
import moment from 'moment'
export default {
    components:{
        compSelector,
    },
    props:{

    },
    data(){
        return{
            visible:false,
            formState:{},
            form: this.$form.createForm(this, { name: 'coordinated' }),
            rules:{
                fwjxsmc: [{
                    required: true,
                    message: '请输入工序名称',
                    trigger: 'blur',
                }],
                fwjlx5: [{
                    required: true,
                    message: '请输入关键工艺及参数',
                    trigger: 'blur',
                }],
            },
            rylxList:[],
            fwjxsmc:'',
        }
    },
    watch:{

    },
    mounted(){
        queryYwzdByCode().then(res=>{
            if(res.code == 200){
                this.rylxList = res.result
            }else{
                this.$message.warning(res.message)
            }
        })
    },
    methods:{
        getData(row,val){
            this.formState = {}
            this.formState = {fqyid:row.fqyid,fpzid:row.fpzid,...val}
            //console.log('是否再次获取',val)
            this.fwjxsmc = val.fwjxsmc
        },
        uploadIzClick(){
            this.form.validateFields((err, values) => {

            })
        },
        uploadChange({file}){
            if(this.formState.id){
                const fileData = new FormData();
                fileData.append("fqyid",this.formState.fqyid);
                fileData.append("fpzid",this.formState.fpzid);
                fileData.append("fwjxsmc",this.formState.fwjxsmc);
                fileData.append("fwjlx5",this.formState.fwjlx5);
                fileData.append("fwjlx6",this.formState.fwjlx6);
                fileData.append("id",this.formState.id);
                fileData.append("file",file);
                spcyQyInfouploadThgyFile(fileData).then(res=>{//替换文件
                    if(res.code == 200){
                        this.formState = {
                            ...this.formState,
                            ...res.result,
                        }
                        this.fwjxsmc = res.result.fwjxsmc
                        this.$emit('fileSuccessChange')
                        this.$message.success(res.message)
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            }else{
                const fileData = new FormData();
                fileData.append("fqyid",this.formState.fqyid);
                fileData.append("fpzid",this.formState.fpzid);
                fileData.append("fwjxsmc",this.formState.fwjxsmc);
                fileData.append("fwjlx5",this.formState.fwjlx5);
                fileData.append("fwjlx6",this.formState.fwjlx6);
                fileData.append("file",file);
                spcyQyInfouploadScgyFile(fileData).then(res=>{
                    if(res.code == 200){
                        //console.log('新增了什么',res)
                        this.formState = {
                            ...this.formState,
                            ...res.result,
                        }
                        this.fwjxsmc = res.result.fwjxsmc
                        this.$emit('fileSuccessChange')
                        this.$message.success(res.message)
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            }
        },
        downloadClick(){
            this.$emit('downloadClick',this.formState)
        },
        handleOk(val){
            this.form.validateFields((err, values) => {
                if (!err) {
                    if(this.formState.id){
                        spcyQyInfoupdateFj(this.formState).then(res=>{//修改信息
                            if(res.code == 200){
                                this.$message.success(res.message)
                                this.formState = {
                                    ...this.formState,
                                    ...res.result,
                                }
                                this.fwjxsmc = res.result.fwjxsmc
                                this.$emit('fileSuccessChange')
                            }else{
                                this.$message.warning(res.message)
                            }
                        })
                    }else{
                        const fileData = new FormData();
                        fileData.append("fqyid",this.formState.fqyid);
                        fileData.append("fpzid",this.formState.fpzid);
                        fileData.append("fwjxsmc",this.formState.fwjxsmc);
                        fileData.append("fwjlx5",this.formState.fwjlx5);
                        fileData.append("fwjlx6",this.formState.fwjlx6);
                        spcyQyInfouploadScgyFile(fileData).then(res=>{
                            if(res.code == 200){
                                //console.log('新增了什么',res)
                                this.formState = {
                                    ...this.formState,
                                    ...res.result,
                                }
                                this.fwjxsmc = res.result.fwjxsmc
                                this.$emit('fileSuccessChange')
                                this.$message.success(res.message)
                            }else{
                                this.$message.warning(res.message)
                            }
                        })
                    }
                    
                    
                }
            })
        },
    }
}
</script>
<style lang="less">
.enterprise-add-edit-modal{
    .add-edit-form{
        display: flex;
        flex-wrap: wrap;
        .ant-form-item{
            display: flex;
        }
        .ant-form-item-label{
            width: 85px;
        }
        .ant-form-item-control-wrapper{
            width: 180px;
        }
        .flex-1-box{
            width: 100%;
            .ant-form-item-control-wrapper{
                flex: 1;
            }
        }
    }
}
</style>